import { Vue, Component, Prop } from 'vue-property-decorator'
import { TodoModule } from '../../store/modules/todo'
/* import VueTsxSupportTodo from '@todo/vue-tsx-support' */
@Component({
    /* components: {VueTsxSupportTodo}, */
})
export default class TsxClassTodo extends Vue {
  private msg: string = 'Welcome to Your Vue-Typescript App'
  private checked: boolean = true
  @Prop(String) private name!: string
  private onChange(name: string) {
    this.msg = `${name} Welcome to Your Vue-Typescript App`
    console.log('parent')
  }
  private onInput(value: boolean) {
      this.checked = value;
      console.log(this.checked, 'parent')
  }
  private render() {
      console.log(TodoModule, 'TodoModule', this.$store)
      return (<div style='color:red'>
          {/* <HelloWorldTsx {...{ props: { name: '解构' } }}></HelloWorldTsx> */}
           <p>{/* <VueTsxSupportTodo
           vueTsxSupportMessage='vue tsx support'
           value={this.checked}
           on-input={this.onInput.bind(this)}
           onOn-change={this.onChange.bind(this)}></VueTsxSupportTodo> */}</p>
           <span>{this.name},{this.msg}</span>
      </div>)
  }
}
